<template>
	<view class="set-content" @click="handlerItem()">
		<view class="set-content-left">
			<image src="@/static/icons/wechat.png" mode=""
				style="width:35rpx;height:35rpx;margin-right:10rpx;vertical-align:middle"></image>
			微信好友
		</view>
		<view class="set-content-right">
			<view class="set-content-right-icon">
				<up-icon name="arrow-right"></up-icon>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted
	} from "vue"
	import {
		onLoad
	} from '@dcloudio/uni-app'
	const deviceId = ref('')
	const qrcodeUrl = ref('')
	const localImagePath = ref('')
	onLoad((options) => {
		deviceId.value = decodeURIComponent(options.id)
		initCode(deviceId.value)
	});

	const initCode = (id) => {
		uni.$u.http.post('/wechat/getDevShareCodeImg', {
			id: id
		}).then((res) => {
			if (res.success) {
				qrcodeUrl.value = res.codeUrl
				downloadImage()
			}
		})
	}
	// 下载图片
	const downloadImage = () => {
		if (qrcodeUrl.value.startsWith('https')) {
			uni.downloadFile({
				url: qrcodeUrl.value,
				success: (downloadRes) => {
					localImagePath.value = downloadRes.tempFilePath
				},
				fail: (err) => {
					console.error('下载二维码失败:', err)
				}
			})
		} else {
			localImagePath.value = qrcodeUrl.value
		}
	}

	const handlerItem = async () => {
		// 先确保图片已下载
		if (!localImagePath.value) {
			uni.showToast({
				title: '二维码获取失败',
				icon: 'none'
			})
		} else {
			await uni.showShareImageMenu({
				path: localImagePath.value // 图片本地路径
			})
		}
		return
	}
</script>
<style lang="scss" scoped>
	.set-content {
		display: flex;
		justify-content: space-between;
		padding: 25rpx 0;
		margin: 0 40rpx;
	}

	.set-content-right {
		display: flex;
		color: #797979;

		.set-content-right-icon {
			width: 40rpx;
			text-align: right;
			padding-left: 20rpx;
			padding-top: 5rpx;
		}
	}
</style>